<template>
    <div class="newsLists">
        <pub-head isBorder="true"></pub-head>

        <!-- 头部 -->
        <div class="head ali-c flex">
            <router-link :to="'/'">首页 ></router-link>
            <span class="blue-c">&nbsp;建筑资讯</span>
        </div>

        <!-- 列表 -->
        <div class="news-list-box flexcv">
            <div class="news-box-head ali-c flex jus-b">
                <span class="news-box-name">建筑资讯</span>
            </div>


            <ul class="news-lists flexv">
                <li class="news-list flex" v-for="(item, index) in lists" :key="index">
                    <router-link :to="'/newsDetail/' + item.id" class="flex1 flexv jus-b">
                        <div class="flex">
                            <span class="new-list-point"></span>
                            <p class="oneline flex1">{{item.title}}</p>
                        </div>
                        <div class="news-time">{{timestampToTime(item.add_time)}}</div>
                    </router-link>
                </li>
            </ul>

        </div>


        <pub-foot index="true"></pub-foot>
    </div>
</template>
<script>
import Vue from 'vue';
import { mapState } from 'vuex';
import { Toast, List } from 'vant';
import pubHead from '@/components/head';
import pubFoot from '@/components/foot';

Vue.use(Toast).use(List)
export default {
    data(){
        return{
            lists: [], // 资讯列表
        }
    },
    created(){
        this.getData();
    },
    computed: {
        ...mapState(['user'])
    },
    components: {
        pubHead,
        pubFoot
    },
    methods: {
        getData(){
            this.axios.get('http://jxjq.0791jr.com/index.php?m=App&c=Index&a=Consult', {
                params: {
                    uid: this.$store.state.user.uid,
                    pagesize: 10,
                    page: 1
                }
            }).then(res => {
                if(res.status == 200){
                    const data = res.data.data
                    this.lists = data.list
                }
            })
        },
        // 时间转换
        timestampToTime(timestamp) {
            var date = new Date(timestamp * 1000);//时间戳为10位需*1000，时间戳为13位的话不需乘1000
            var Y = date.getFullYear() + '-';
            var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
            var D = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate());
            // var D = date.getDate() + '- ';
            // var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
            // var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
            // var s = (date.getSeconds() <10 ? '0' + date.getSeconds() : date.getSeconds());
            return Y+M+D;
            // return Y+M+D+h+m+s;
        },
    },
}
</script>
<style lang="less" scoped>
.newsLists {
    min-height: 100vh;
    background-color: #f5f5f5;
    .head {
        height: 0.8rem;
        padding: 0 0.24rem;
        font-size: 0.28rem;
        line-height: 120%;
        span,a {
            color: #999;
            font-weight: bold;
        }
    }
    .news-list-box{
        .news-box-head{
            width: 100%;
            height: 0.85rem;
            padding: 0 0.24rem;
            background-color: #fff;
            border-bottom: 1px solid #dcdcdc;
            .news-box-name {
                height: 0.3rem;
                margin: auto 0;
                padding-left: 0.1rem;
                border-left: 0.04rem solid #000;
                font-size: 0.3rem;
                line-height: 0.3rem;
                font-weight: bold;
                color: #333;
            }
        }
        .news-lists{
            padding: 0 0.24rem;
            background-color: #fff;
            .news-list {
                width: 100%;
                height: 1.25rem;
                padding: 0.24rem 0;
                border-bottom: 1px solid #dcdcdc;
                .new-list-point {
                    width: 0.1rem;
                    height: 0.1rem;
                    margin: auto 0;
                    background-color: #1f78ff;
                }
                .oneline {
                    margin-left: 0.16rem;
                    font-size: 0.28rem;
                    color: #333;
                }
                .news-time {
                    // margin-top: 0.24rem;
                    margin-left: 0.3rem;
                    font-size: 0.24rem;
                    line-height: 120%;
                    color: #999;
                }
            }
            .news-list:last-child {
                border-bottom: none;
            }
        }
    }
}
</style>
